<template>
  <div class="dashboard_containers">
    <div class="list" v-for="(item,index) in list" :key="index">
        <h3 class="title">{{item.name}}</h3>
        <div class="li">
            <div class="li_box" v-for="(item2,index2) in item.children" :key="index2" @click="toPath(item2)">
              <img :src="require(`@/assets/dashboard/${Number(item2.id)}.png`)" class="li_icon" alt="">
              <div class="text">{{item2.name}}</div>
            </div>
        </div>
    </div>
  </div>
</template>

<script>
import store from "@/store/index.js";
  export default {
    data(){
      return{
        list:[]
      }
      },
    methods: {
      toPath(item){
        this.$router.push(item.path)
      }
    },
    mounted(){
      const userRoutes = store.state.account.routes;
      this.list = userRoutes.filter(item => item.name != '404' && item.name != '首页')
      console.log('===userRoutes',this.list)
      // 获取全部字典值
      this.$commonJs.getAllDataDictionary()
      // 首先跳转综合大屏
      let integratedLargeScreen=this.list.find(item => item.name == '综合大屏');
      let remotePath=integratedLargeScreen.meta.remotePath
      //window.close();
      window.open(remotePath);
      //window.location.href=remotePath;

    }
  }
</script>

<style lang="scss" scoped>
.dashboard_containers{
  padding-left: 20px;
  .li{
    display: flex;
    padding: 10px 40px;


    .li_box{
    text-align: center;
    display: inline-block;
     border: 1px solid #fff;
    padding: 20px ;
    margin-right: 20px;
    cursor: pointer;
    .text{
      font-size: 14px;
    }
  }
    .li_box:hover{
      border: 1px solid #666;
    }
  }

}
</style>
